<template>
  <view>
    <uv-empty v-if="!listData.length" mode="list"></uv-empty>
    <uni-collapse-item titleBorder="none" v-for="(item, index) in listData" :key="index">
      <template v-slot:title>
        <uni-list>
          <uni-list-item
            :title="item.goodsType + item.buyDate || ''"
            :show-extra-icon="false"
            :extra-icon="extraIcon"
          >
          </uni-list-item>
        </uni-list>
      </template>
      <view class="content">
        <uni-list>
          <!-- <uni-list-item title="设备类别" :rightText="item.equipmentType" /> -->
          <!-- <uni-list-item title="设备类别" rightText="1" /> -->
          <!-- <uni-list-item title="设备品牌" :rightText="item.equipmentBrand" /> -->
          <!-- <uni-list-item title="设备型号" :rightText="item.equipmentModel" /> -->
          <uni-list-item title="物资分类" :rightText="detail.goodsType" />
          <uni-list-item title="物资名称" :rightText="detail.goodsName" />
          <uni-list-item title="规格型号" :rightText="detail.goodsModel" />
          <uni-list-item title="设备序列号" :rightText="item.equipmentSeq" />
          <uni-list-item title="设备购置时间" :rightText="item.buyDate" />
          <uni-list-item title="设备原值" :rightText="item.originalValue" />
          <uni-list-item title="设备来源" :rightText="item.equipmentSrc" />
          <uni-list-item title="设备状态" :rightText="item.equipmentStatus" />
          <uni-list-item title="设备率定时间" :rightText="item.ratedDate" />
          <uni-list-item title="使用部门" :rightText="item.usedDept" />
          <uni-list-item title="使用班组" :rightText="item.usedTeam" />
          <uni-list-item title="存放位置" :rightText="item.position"> </uni-list-item>
          <uni-list-item title="固定资产编号" :rightText="item.assetNumber" />
          <!-- <uni-list-item title="列表文字" note="列表描述信息" rightText="右侧文字" /> -->
        </uni-list>
      </view>
    </uni-collapse-item>

    <uni-section v-if="listData.length" class="bottom" padding>
      <uni-pagination :total="total" title="标题文字" :current="current" :pageSize="pageSize" @change="getListDate" />
    </uni-section>
    <!-- 	
		<view class="footer">
			<button class="btn" @click="inputDialogToggle">更新</button>
			<button class="btn" @click="goto('/pages/about/about')">查看历史</button>
		</view>
		
		<uni-popup ref="inputDialog" type="dialog">
				<uni-popup-dialog ref="inputClose" title="更新信息" 
					 @confirm="dialogInputConfirm" :before-close="true" @close="close" >
					 <view>
						  <view class="">
							<uni-forms  ref="valiForm" :rules="rules" :modelValue="typeFormData">
							  <uni-forms-item label="名称" name="usedTeam" required>
								<uni-easyinput type="text" v-model="typeFormData.usedTeam" placeholder="请输入使用班组"/>
							  </uni-forms-item>
							  <uni-forms-item label="类型" name="position" required>
							   <uni-easyinput type="text" v-model="typeFormData.position" placeholder="请输入设备存放位置"/>
							  </uni-forms-item>
							</uni-forms>
						  </view>
						</view>
					
					</uni-popup-dialog>
			</uni-popup> -->
  </view>
</template>

<script>
import { getPositionDetailList, updateInfo, getPositionType } from "@/api/me";
export default {
  data() {
    return {
      indicatorStyle: `height: 50px;`,
      typeValue: [0, 0],
      typeList: [],
      listData: [],
      current: 1,
      total: 0,
      pageSize: 10,
      typeFormData: {
        usedTeam: "",
        position: "",
      },
      // 校验规则
      rules: {
        usedTeam: {
          rules: [
            {
              required: true,
              errorMessage: "不能为空",
            },
          ],
        },
        position: {
          rules: [
            {
              required: true,
              errorMessage: "不能为空",
            },
          ],
        },
      },
    };
  },
  onLoad(op) {
    this.id = op.id;
    this.getListDate();
  },
  methods: {
    close() {
      // TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
      // ...
      this.$refs.popup.close();
    },
    open() {
      this.$refs.popup.open();
    },
    bindChange: function (e) {
      const val = e.detail.value;
      this.typeValue = [val[0], val[1]];
    },
    /**
     * 点击确认按钮触发
     * @param {Object} done
     * @param {Object} value
     */
    confirm(value) {
      // 输入框的值
      console.log(value);
      // TODO 做一些其他的事情，手动执行 close 才会关闭对话框
      // ...
      this.$refs.popup.close();
      this.getListDate();
    },
    getTypeDetail(e) {
      // let res = await getList()
      getPositionType()
        .then((res) => {
          console.log(res);
          let typeList = [];
          for (let key in res) {
            typeList.push({
              name: key,
              list: res[key],
            });
          }
          this.typeList = typeList;
          debugger;
        })
        .catch((err) => {
          uni.showToast({
            title: err || "获取类型失败",
            icon: "error",
          });
        });
    },
    getListDate(e) {
      if (e) {
        let { type, current } = e;
        console.log(type, current);
        this.current = current;
      }

      // let res = await getList()
      getPositionDetailList({
        pageSize: this.pageSize,
        pageNum: this.current,
        position: this.id,
      }).then((res) => {
        console.log(res);
        this.listData = res.rows;
        this.total = res.total;
        // uni.showToast({
        // 	title: '查询成功！',
        // 	icon:'success'
        // })
      });
    },
    inputDialogToggle() {
      this.$refs.inputDialog.open();
    },
    dialogInputConfirm() {
      console.log(this.typeFormData);
      this.$refs["valiForm"]
        .validate()
        .then((res) => {
          console.log("success", res);
          uni.showToast({
            title: `校验通过`,
          });
          updateInfo({
            id: 1,
          }).then((res) => {
            console.log(res);
            this.listData = res?.rows;
          });
          this.close();
        })
        .catch((err) => {
          console.log("err", err);
        });
    },
    close() {
      // TODO 做一些其他的事情，before-close 为true的情况下，手动执行 close 才会关闭对话框
      // ...
      this.$refs.inputDialog.close();
    },
  },
};
</script>

<style lang="scss">
page {
  background-color: #fff;
  // padding-top: 110rpx;
  .app-search-wrap {
    z-index: 99;
  }
  .sbtn {
    color: #007aff;
    line-height: 72rpx;
    font-size: 28rpx;
    display: flex;
    justify-content: center;
  }
}

.header {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.footer {
  display: flex;
  flex-direction: row;
  padding: 20rpx;
}

.footer .btn:not(:last-child) {
  margin-right: 20rpx;
}

.btn {
  flex: 1;
  height: 70rpx;
  line-height: 70rpx;
  text-align: center;
  font-weight: bold;
  width: 100%;
  border-radius: 16rpx;
  color: #2879ff;
  background: rgba(40, 121, 255, 0.2);
}

.picker-view {
  width: 750rpx;
  height: 600rpx;
  margin-top: 20rpx;
}

.item {
  line-height: 100rpx;
  text-align: center;
}
</style>
